<template>
    <div id="app">
        <Header notab="localNews"/>
        <div class="contentWeb clear">
            <!--  左侧导航栏-->
            <div class="left_navbar">
                <el-menu
                        :default-active="'index' +search.type"
                        class="el-menu-vertical-demo"
                        background-color="#fff"
                        text-color="#1e1e1e"
                        active-text-color="#20a2b2">
                    <el-menu-item :index="'index' + item.id" v-for="(item, index) in leftList" @click="toleft(item)"
                                  :key="index" style="text-align: center;">
                        <!--<img :src="item.thumb">-->
                        {{item.subTypeName}}
                    </el-menu-item>
                </el-menu>
            </div>
            <!--右侧主体-->
            <div class="navbar_content">
                <div class="title">{{active.title}}</div>
                <div class="message" v-for="(item, index) in datalist" :key="index" @click="toDetail(item.id)">
                    <div class="message_img">
                        <img v-if="1 == item.isTop" src="../../assets/img/top.png"
                             style="width: 40px; height: 20px;margin-right: 10px;" alt="">
                        <i v-if="0 == item.isTop" class="el-icon-caret-right"></i>
                        {{item.title}}
                    </div>
                    <div class="message_time">{{item.createTime}}</div>
                </div>
                <Noview v-if="total == 0"/>
            </div>

        </div>
        <div style="text-align: center" v-if="totalpage > 1">
            <el-pagination
                    background
                    layout="prev, pager, next"
                    :page-count="totalpage"
                    :current-page="search.pageNum"
                    @current-change="getlist"
            >
            </el-pagination>
        </div>
        <Footer/>
    </div>
</template>
<script type="text/babel">
// @ is an alias to /src
import Header from '../../components/header'
import Footer from '../../components/footer'
import { InquityLocalByType, LocalInquiryState, GetQueryString, searchInquiryLocal } from '../../assets/js/domains'
import hangyexinzi from '../../assets/img/hangyexinzi.png'
import rencaizhengce from '../../assets/img/rencaizhengce.png'
import shebaoxiangguan from '../../assets/img/shebaoxiangguan.png'
import gongjijin from '../../assets/img/gongjijin.png'
import Noview from '../../components/noview'

export default {
  name: 'LocalNews',
  components: {
    Header,
    Footer,
    Noview
  },
  directives: {},
  data: function () {
    return {
      leftList: [],
      active: { title: '' },
      hangyexinzi: hangyexinzi,
      rencaizhengce: rencaizhengce,
      shebaoxiangguan: shebaoxiangguan,
      gongjijin: gongjijin,
      search: {
        type: 0,
        pageNum: 1,
        pageSize: 50
      },
      datalist: [],
      total: 0,
      totalpage: 0,
      select_where: {
        title: '',
        current_page: 1,
        page_size: 50
      }
    }
  },
  created: function () {
    document.title = '本地资讯'
    if (GetQueryString('title')) {
      this.select_where.title = decodeURI(GetQueryString('title'))
      this.searchInquiryLocal(1)
      this.getLocalInquiryStateNew()
    } else {
      this.getLocalInquiryState()
    }
  },
  computed: {},
  mounted: function () {
    // this.getLocalInquiryState()
  },
  methods: {
    toleft: function (item) {
      this.search.pageNum = 1
      this.search.type = item.id
      this.active.title = item.subTypeName
      this.getlist(1)
    },
    searchInquiryLocal: function (val) {
      const _this = this
      _this.select_where.current_page = val
      searchInquiryLocal(_this.select_where).then(function (res) {
        if (res.code === 200) {
          _this.datalist = res.data.content
          // if (_this.leftList.length > 0) {
          //     _this.search.type = _this.leftList[0].id
          //     _this.active = { title: _this.leftList[0].subTypeName }
          //     _this.getlist()
          // }
        }
      })
    },
    getLocalInquiryState: function () {
      const _this = this
      LocalInquiryState().then(function (res) {
        if (res.code === 200) {
          _this.leftList = res.data
          if (_this.leftList.length > 0) {
            _this.search.type = _this.leftList[0].id
            _this.active = { title: _this.leftList[0].subTypeName }
            _this.getlist(1)
          }
        }
      })
    },
    getLocalInquiryStateNew: function () {
      const _this = this
      LocalInquiryState().then(function (res) {
        if (res.code === 200) {
          _this.leftList = res.data
          _this.active = { title: '本地咨询' }
          // if (_this.leftList.length > 0) {
          //     _this.search.type = _this.leftList[0].id
          //     _this.active = { title: _this.leftList[0].subTypeName }
          // }
        }
      })
    },
    getlist: function (val) {
      const _this = this
      val && (_this.search.pageNum = val)
      InquityLocalByType(this.search).then(function (res) {
        if (res.code === 200) {
          _this.datalist = res.data.content
          _this.total = Number(res.data.totalElements)
          _this.totalpage = Number(res.data.totalPages)
          console.log(_this.total)
        } else {
          _this.$alert(res.msg, '提示', {
            confirmButtonText: '确定',
            callback: function () {

            }
          })
        }
      })
    },
    toDetail: function (id) {
      window.location.href = 'newsDetail.html?id=' + id
    }

  }
}
</script>
<style lang="less" scoped>
    @import "../../assets/css/localNews";
</style>
